*{
    padding: 0;
    margin: 0;
}
li{
    list-style: none;
}
a{
    text-decoration: none;
}
.px2rem(@name, @px){
    @{name}: @px / 75 * 1rem;
}
.top{
    width: 100%;
    .px2rem(height,88);
    background-color: #fa6958;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.top div{
    .px2rem(margin-left,10)
}
.top img{
    .px2rem(margin-right,10)
}
.xi a{
    font-size: 24px;
    color: #fff;
}
.top h2{
    font-size: 32px;
    color: #fff;
    letter-spacing: 4px;
}
.nav{
    width: 100%;
    .px2rem(height,280);
    background-color: #fa6958;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.nav h2{
    .px2rem(font-size,24);
    color: #fff;
     .px2rem(margin-top,20)
}
.nav span{
    .px2rem(font-size,24);
    color: #ffc6c5;
     .px2rem(margin-top,20)
}
.main{
     width: 100%;
    .px2rem(height,150);
    background-color: #fa6958;
    display: flex;
    justify-content: space-between;
    align-content: center;
}
.main a{
    .px2rem(width,80);
    color: #fff;
    .px2rem(font-size,22);
}
.main div{
      display: flex;
      flex-direction: column;
      flex: 1;
      justify-content: center;
      align-items: center;
}
.main div:first-child{
     .px2rem(margin-left,20)
}
.main div:last-child{
     .px2rem(margin-right,22)
}
.main div>span{
     color: #fff;
    .px2rem(font-size,26);
}
.footer{
    width: 100%;
    .px2rem(height,184);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.footer h2{
    .px2rem(width,380);
    .px2rem(height,70);
    background: #fb5049;
    color: #fff;
    .px2rem(line-height,70);
    text-align: center;
    .px2rem(font-size,28); 
    border-radius: 10px;
}
.footer div{
    .px2rem(margin-top,20);
}
.footer div span{
    .px2rem(margin-left,30);
} 
.footer div span:last-child{
    border-left: 1px solid #000;
    .px2rem(padding-left,30);
}
.footer div a{
    
    color: #ccc;
    .px2rem(font-size,30);
    .px2rem(margin-left,10);
}
.man{
    widows: 100%;
    display: flex;
    .px2rem(height,90); 
    background: #f5f5f5;
    align-items: center;
    .px2rem(font-size,30);
    justify-content: space-between;
}
.man h2{
    .px2rem(margin-left,20);
}
.man span{
    .px2rem(margin-right,20);
}
.man span img{
    .px2rem(margin-left,10);
}
.ma{
    width: 100%;
    .px2rem(height,200);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.ma div{
    .px2rem(width,220);
    .px2rem(height,120);
    border: 2px solid #ccc;
    border-radius: 8px;
    .px2rem(margin-right,20);
    .px2rem(margin-left,20);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.ma div:first-child a, .ma div:nth-child(2) a{
    color: red;
    .px2rem(font-size,26);
}
.ma div:last-child a{
    color: green;
    .px2rem(font-size,26);
}
.ma div span{
    color: #ccc;
}
.wang{
    width: 100%;
     .px2rem(height,180);
     border-bottom: 1px dashed #ddd;
     display: flex;
     justify-content: space-between;
     align-items: center;
     
     div{
         width: 100%;
         display: flex;
         flex: 1;
          flex-wrap: wrap;
         align-items: center;
         justify-content:space-between;
          .px2rem(padding-left,30);
          text-align: center;
        }
        div:nth-child(2),div:nth-child(4) span{
            color: red;
        }
        h3{
            width: 100%;
            .px2rem(padding-bottom,30);
            
        }
         span{
             display: block;
             width:100%;
             .px2rem(padding-bottom,18);
         }
        
}